@charset "utf-8";
@import "reset";
@import "base";
@import "common";


header{
    padding: 0 vw(20);    
    height: vw(57);
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: vw(48);

    .logo{
        width: vw(123);
        height: vw(57);
        border: 1px solid $color;
        border-radius: vw(20);
        text-align: center;
        line-height: vw(57);

        span{
            font-size: vw(26);
            font-weight: bold;
        }
    }

    p{
        font-size: vw(26);
        line-height: vw(57);
        // font-weight: bold;
    }

    .iconfont{
        position: relative;
        color: $color;
        font-size: vw(62);

        .yuan{
            position: absolute;
            width: vw(28);
            height: vw(28);
            background-color: red;
            border-radius: 50%;
            right: 0;
            top: 0;
            font-size: vw(20);
            color: #fff;
            text-align: center;
            line-height: vw(28);
        }
    }

}

.register{
    margin-top: vw(20);
    padding: 0 vw(23);
    display: flex;
    align-items: center;
    justify-content: space-between;
    .logo{
        display: flex;

        .imges{
            width: vw(170);
            height: vw(170);
            border-radius: 50%;
        }

        .text{
            padding: vw(15) 0;
            margin-left: vw(25);
            display: flex;
            flex-direction: column;
            justify-content: space-around;
    
            p{
                font-size: vw(30);
                font-weight: bold;

                a{
                    color: #000;
                }
            }
    
            span{
                font-size: vw(26);

                a{
                    color: #9d9d9d;
                }
            }


        }
        
    }

    .iconfont{
        font-size: vw(41);
        color: #000;
    }
}

.remark{
    margin-top: vw(25);
    display: flex;
    padding: 0 vw(23);
    justify-content: space-between;

    .box{
        width: vw(195);
        height: vw(150);
    }
}

main{
    padding: 0 vw(22);
    margin-top: vw(30);
    .main-top{
        ul{
            li{
                display: flex;
                justify-content: space-between;
                align-items: center;
                margin-bottom: vw(30);

                .left{
                    .iconfont{
                        font-size: vw(70);
                        color: $color;
                        vertical-align: middle;
                        margin-right: vw(10);
                    }

                    span{
                        font-size: vw(26);
                    }
                }

                .right{
                    span{
                        font-size: vw(24);
                    }

                    .iconfont{
                        font-size: vw(30);
                        color: $color;
                        margin-left: vw(10);
                    }
                }
            }

            li:last-of-type{
                margin-bottom: 0;
            }
        }
    }

    .main-bottom{
        margin-top: vw(80);
        ul{
            li{
                display: flex;
                justify-content: space-between;
                align-items: center;
                margin-bottom: vw(24);

                .left{
                    .iconfont{
                        font-size: vw(80);
                        color: $color;
                        vertical-align: middle;
                        margin-right: vw(10);
                    }

                    span{
                        font-size: vw(26);

                        a{
                            color: #000;
                        }
                    }
                }

                .right{
                    span{
                        font-size: vw(24);

                        a{
                            color: #000;
                        }
                    }

                    .iconfont{
                        font-size: vw(30);
                        color: $color;
                        margin-left: vw(10);
                    }
                }
            }

            li:last-of-type{
                margin-bottom: 0;
            }
        }
    }

    .button{
        margin-top: vw(36);
        padding: 0 vw(82);
        display: flex;
        justify-content: space-between;
        button{
            width: vw(150);
            height: vw(80);
            background-color: $color;
            font-size: vw(24);
            text-align: center;
            line-height: vw(80);
            border: none;
            border-radius: vw(80);
            color: #fff;
        }
    }
}